﻿
@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>会议签到</title>
    <script src="~/Scripts/jquery-3.3.1.min.js"></script>
    <link href="~/Content/miniMobile/css/miniMobile.css" rel="stylesheet" />
    <script src="~/Content/miniMobile/js/zepto.min.js"></script>
    <script src="~/Content/miniMobile/js/miniMobile.js"></script>
    <link href="~/Content/miniMobile/plugins/mobileSelect/mobileSelect.css" rel="stylesheet" />
    <script src="~/Content/miniMobile/plugins/mobileSelect/mobileSelect.js"></script>
    <script src="~/Content/miniMobile/plugins/icheck/icheck.js"></script>
    <link href="~/Content/miniMobile/plugins/noUiSlider.10.0.0/nouislider.css" rel="stylesheet" />
    <script src="~/Content/miniMobile/plugins/noUiSlider.10.0.0/nouislider.js"></script>
    <link href="~/Content/miniMobile/plugins/fonticon/iconfont.css" rel="stylesheet" />
    <script src="~/Content/layer/layer.js"></script>
</head>
<body class="pb12 fadeIn animated">
    <header class="ui-header clearfix w75 h8 f46 pl3 pr3 color8 bg-color-primary t-c">
        <div class="ui-header-l fl w5">
        </div>
        <div class="ui-header-c fl f30 w59">
            @ViewBag.MeetName
        </div>
        <div class="ui-header-r fr w5">

        </div>
    </header>
    <style>
        .formheader {
            line-height: 0.7rem;
        }

            .formheader span {
                display: inline-block;
            }

            .formheader input {
                border: none;
            }
    </style>
    <div class="p3 f30 f30 w75" style="padding-top:1.2rem">
        <form>

            <div class="pt2 pb2">
                姓名:
                <input type="text" class="w57  form-control" style="width:5.1rem;" placeholder="请输入姓名" id="UserName" />
            </div>
            <div class="pt2 pb2">
                单位:
                <input type="text" class="w57  form-control" style="width:5.1rem;" placeholder="请输入单位" id="CompanyName" />
            </div>
            <div class="pt2 pb2">
                职务:
                <input type="text" class="w57  form-control" style="width:5.1rem;" placeholder="请输入职务" id="Position" />
            </div>

            <div class="pt2 pb2">
                电话:
                <input type="text" class="w57  form-control" style="width:5.1rem;" placeholder="请输入电话" id="PhoneNum" /><span>*</span>
            </div>

            <div class="pt2 pb2 blue js_uploadBox" style="position:relative;">
                头像:
                <div class="btn-upload">
                    <a href="javascript:void(0);"><i class="icon-upload"></i><span class="js_uploadText">点击</span>拍照</a>
                    <input class="js_upFile" type="file" name="cover" accept="image/*" capture="camera">
                </div>

                <div class="js_showBox "><img class="js_logoBox" id="HeadUrl" src="" width="100px"></div>

            </div>
            <div class="pt2 pb2">
                备注:<a style="color:red">请关闭(不要使用)美颜功能<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;请看到预览图后再提交申请(受手机网络速度影响,部分手机上传会比较慢,如超过五秒未上传成功请重新添加)</a>
            </div>
            <div class="t-c mt5">
                <span class="w18 h7 btn radius5 btn-primary" onclick="fnSave()">提交申请</span>
            </div>
            <input type="hidden" id="iosType" />
        </form>
    </div>
    <nav class="demo-bottomNav mt6 w75 h12 pt1 t-c f28 bg-color8 o-h clearfix">
        版权所有:江苏环宇臻视智能科技有限公司
    </nav>
    <script src="~/Content/miniMobile/js/jquery.uploadView.js"></script>
    <script type="text/javascript">
        var ios = 2;
        $(".js_upFile").uploadView({
            uploadBox: '.js_uploadBox',//设置上传框容器
            showBox: '.js_showBox',//设置显示预览图片的容器
            width: 100, //预览图片的宽度，单位px
            height: 100, //预览图片的高度，单位px
            allowType: ["gif", "jpeg", "jpg", "bmp", "png"], //允许上传图片的类型
            maxSize: 10, //允许上传图片的最大尺寸，单位M
            success: function (e) {
                layer.msg('照片上传中请等待', {
                    icon: 16
                    , shade: 0.01
                });

                if (gt_ios4()) {
                    ios = 1;
                }
                $("#iosType").val(ios);
                $.post("@Url.Action("SaveHeadImg", "Visitor")", { base64: e, type: ios }, function (result) {
                    if (result.state == 1) {
                        $("#HeadUrl").attr("src", result.data);
                    }
                    layer.closeAll('loading');
                })
            }
        });
        function gt_ios4() {
            var u = navigator.userAgent, app = navigator.appVersion;

            var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
            return isIOS;
        }
        function fnSave() {
            if ($("#UserName").val() == "") {
                layer.msg('姓名不可为空'); return;
            }
            if ($("#HeadUrl").attr("src") == "") {
                layer.msg('请上传照片'); return;
            }

            $.post('@Url.Action("SaveCompany", "Visitor")', queryParams(), function (result) {
                if (result.state == 1) {
                    layer.msg('操作成功');
                }
                else {
                    layer.msg(result.message);
                }
            })
        }
        function queryParams() {
            return {
                UserName: $("#UserName").val(),
                CompanyName: $("#CompanyName").val(),
                Position: $("#Position").val(),
                Company: $("#Company").val(),
                PhoneNum: $("#PhoneNum").val(),
                HeadUrl: $("#HeadUrl").attr("src"),
                IosType: $("#iosType").val()
            };
        }
    </script>
</body>


</html>
